/**
 * Created by ZHOUSH on 1/6/2016.
 */
var foundClz = function (dom, filter) {
    return dom.className.split(/\s+/ig).filter(filter);
};
ngctrl.directive('dbPanel', ['$compile', '$document', '$window', 'RecursionHelper', function ($compile, $document, $window, RecursionHelper) {
    return {
        restrict: "E",
        templateUrl: "/template/panel",
        replace: true,
        scope: {
            panel: '=dbBind'
        },
        compile: function (element) {
            return RecursionHelper.compile(element, function (scope, element, attrs) {
                var panel = scope.panel;
                var item = element;
                var layout = $('#layout');
                scope.onresize = function () {
                    var top = layout.position().top, wHeight = $(window).height();
                    var paddingBottom = 6, paddingVertial = 6;
                    var deviceSize = 'sm';
                    var parent = panel.parent;
                    var w = panel.size[0], h = panel.size[1];
                    if (parent) {
                        w = (w > parent.size[0] ? parent.size[0] : w) * (12 / parent.size[0]);
                        h = (h > parent.size[1] ? parent.size[1] : h);
                    }
                    var wClass = 'col-' + deviceSize + '-' + w;
                    var colClz = foundClz(item[0], function (item) {
                        return item.match(/col-(xs|sm|md|lg)-\d+/ig);
                    });
                    item.removeClass(colClz.join(' ')).addClass(wClass);
                    var space = wHeight - top - paddingBottom;
                    var unit = space / 9 * h - paddingVertial - 1.5;
                    item.find('.panel').height(unit)
                };
                if (panel.frame === false) {
                    item.css('padding-left',0).css('padding-right',0);
                    item.find('.panel').css('border', 'none');
                    item.find('.panel-body').css('padding', '0');
                }
                scope.onresize();
                //scope.$apply();
                angular.element($window).bind('resize', function() {
                    scope.onresize();
                });
                if (panel.items) {
                    panel.items.forEach(function (item) {
                        if (typeof item == 'string'
                            && item.substring(0,1) == '<'
                            && item.substring(item.length-1,item.length)=='>') {
                            var html = item;
                            element.find('.db-panel-container').append($compile(html)(scope));
                        } else if (typeof item == 'string') {
                            var type = 'db-' + item.split('=>')[0];
                            var props = item.split('=>')[1].split(',');
                            var bind = '';
                            props.forEach(function (item) {
                                if (item[0] == '@') {
                                    bind = 'db-bind="' + item.substring(1, item.length) + '"';
                                }
                            });
                            var html = '<' + type + ' ' + bind +
                                '><' + type +
                                '/>';
                            element.find('.db-panel-container').append($compile(html)(scope));
                        }
                    })
                }
            });
        }
    }
}]);